<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <link href="http://libs.baidu.com/bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
	<link rel="stylesheet" href="../css/mui.min.css">
	<link rel="stylesheet" type="text/css" href="../css/youyi.css"/>
	<link rel="stylesheet" type="text/css" href="../css/environmental.css"/>
    <title>环保专题</title>
    <style>
   		body{background-color: #fff;}
	</style>	
</head>
<body>
	<div class="mui-content">
		<div class="one_containt">
	        <div class="-container">
	            <div class="one_con_top">
	            <div class="text-center">
	            	<p class="tell_num"><span>400-960-9288</span></p>
	                <p class="text-uppercase title_englsh">the eia project</p>
	                <h3><span>环评专题</span></h3>
	            </div>
	            <div class="top_list_box clearfix">
	                <div class="col-xs-4 text-ellipsis one_top_list">
	                <p class="text-center mui-ellipsis">环评类别</p>
	                </div>
	                <div class="col-xs-4 one_top_list">
	                    <p class="text-center mui-ellipsis">寻找环评机构</p>
	                </div>
	                <div class="col-xs-4 one_top_list">
	                    <p class="text-center mui-ellipsis">环评审批资料下载</p>
	                </div>
	            </div>
	        </div>
	        </div>
	    </div>
	    <div class="two_containt">
            <div class="-container">
                <div class="one_con_sec clearfix">
                    <h3 class="one_con_header text-center"><span>环境的影响程度</span></h3>
                    <div class="sec_list_box clearfix">
                        <div class="col-xs-4 one_con_sec_list">
                            <p class="text-center">报告书</p>
                            <h6 class="text-center"><span>可能千万重大环境影响的项目编制环境影响报告书.</span></h6>
                        </div>
                        <div class="col-xs-4 one_con_sec_list">
                            <p class="text-center">报告表</p>
                            <h6 class="text-center"><span>可能千万重大环境影响的项目编制环境影响报告书.</span></h6>
                        </div>
                        <div class="col-xs-4 one_con_sec_list">
                            <p class="text-center">登记表</p>
                            <h6 class="text-center"><span>可能千万重大环境影响的项目编制环境影响报告书.</span></h6>
                        </div>
                    </div>
                    
                    <div class="customer_service">
                        <p><a href="##">无法判断项目对环境的影响程度度?</a><a href="##">点击查看</a></p>
                        <p><a href="##" class="a_bg_btn">环境影响评价登记名录</a></p>
                        <p><a href="##" class="a_bg_btn">免费咨询优客服</a></p>
                    </div>
                </div>
            </div>
        </div>
        <div class="three_container">
            <div class="">
                <div class="one_con_eia_agency">
                    <h3 class="one_con_header text-center"><span>寻找环评机构</span></h3>
                    <div class="slide_wrap mui-slider" id="Gallery">
	                    <div class="mui-slider-group">
	                    	<div class="mui-slider-item">
			                    <div class="eia_agency_box eia_agency_box1 clearfix mui-table-view mui-grid-view mui-grid-9" id="eia_agency_box">
			                        <div class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3 eia_list_box">
			                            <div><a href="http://www.baidu.com"><h6></h6><p class="mui-ellipsis">华联环保</p></a></div>
			                        </div>
			                        <div class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3 eia_list_box">
			                            <div><a href="http://www.baidu.com"><h6></h6><p class="mui-ellipsis"> 红树林环保</p></a></div>
			                        </div>
			                        <div class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3 eia_list_box">
			                            <div><a href="http://www.baidu.com"> <h6></h6><p class="mui-ellipsis">众志环保</p></a></div>
			                        </div>
			                        <div class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3 eia_list_box">
			                            <div><a href="##"><h6></h6><p class="mui-ellipsis">豪丰环保</p></a></div>
			                        </div>
			                        <div class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3 eia_list_box">
			                            <div><a href="##"><h6></h6><p class="mui-ellipsis">居峰环保</p></a></div>
			                        </div>
			                        <div class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3 eia_list_box">
			                            <div><a href="##"><h6></h6><p class="mui-ellipsis">中南环保</p></a></div>
			                        </div>
			                        <div class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3 eia_list_box">
			                            <div><a href="##"><h6></h6><p class="mui-ellipsis">中科建禹</p></a></div>
			                        </div>
			                        <div class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3 eia_list_box">
			                            <div><a href="##"><h6></h6><p class="mui-ellipsis">衡标检测</p></a></div>
			                        </div>
			                        <div class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3 eia_list_box">
			                            <div><a href="##"><h6></h6><p class="mui-ellipsis">水之源环境</p></a></div>
			                        </div>
			                        <div class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3 eia_list_box">
			                            <div><a href="##"><h6></h6><p class="mui-ellipsis">凯韵水处理</p></a></div>
			                        </div>
			                        <div class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3 eia_list_box">
			                            <div><a href="##"><h6></h6><p class="mui-ellipsis">天欣环保</p></a></div>
			                        </div>
			                        <div class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3 eia_list_box">
			                            <div><a href="##"><h6></h6><p class="mui-ellipsis">绿佳环保</p></a></div>
			                        </div>
			                    </div>
	                   		</div>
	                   		<div class="mui-slider-item">
	                   			<div class="eia_agency_box eia_agency_box2 clearfix mui-table-view mui-grid-view mui-grid-9">                   				
			                        <div class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3 eia_list_box">
			                            <div><a href="##"><h6></h6><p class="mui-ellipsis">恒春环保</p></a></div>
			                        </div>
			                        <div class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3 eia_list_box">
			                            <div><a href="##"><h6></h6><p class="mui-ellipsis">四丰检测</p></a></div>
			                        </div>
			                        <div class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3 eia_list_box">
			                            <div><a href="##"><h6></h6><p class="mui-ellipsis">中金环保</p></a></div>
			                        </div>
			                        <div class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3 eia_list_box">
			                            <div><a href="##"><h6></h6><p class="mui-ellipsis">瑞星环境</p></a></div>
			                        </div>
			                        <div class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3 eia_list_box">
			                            <div><a href="##"><h6></h6><p class="mui-ellipsis">富鹏环保</p></a></div>
			                        </div>
			                        <div class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3 eia_list_box">
			                            <div><a href="##"><h6></h6><p class="mui-ellipsis">绿月环保</p></a></div>
			                        </div>                   				
	                   			</div>
	                   		</div>
	                    </div>
	                    <div class="mui-slider-indicator">
							<div class="mui-indicator mui-active"></div>
							<div class="mui-indicator"></div>
						</div>
					</div>
                </div>
            </div>
        </div>
        <div class="four_container">
        	<div class="">
            	<div class="one_con_need">
                	<div class="mui-table-view mui-grid-view mui-grid-9 clearfix">
                        <div class="mui-table-view-cell mui-media mui-col-xs-4">
                            <div class="need_list_div">
                                 <a href="##"></a>
                                <p class="mui-ellipsis-4">环境登记表报批资料审批时间</p>
                             </div>
                        </div>
                        <div class="mui-table-view-cell mui-media mui-col-xs-4">
                             <div class="need_list_div">
                                 <a href="##"></a>
                                <p class="mui-ellipsis-4">环境登记表报批资料审批时间环境登记表报批资料审批时间</p>
                             </div>
                        </div>
                        <div class="mui-table-view-cell mui-media mui-col-xs-4">
                             <div class="need_list_div">
                                 <a href="##"></a>
                                <p class="mui-ellipsis-4">环境登记表报批资料审批时间</p>
                             </div>
                        </div>
                    </div>
                    <h3 class="one_con_header text-center need_h3"><span>发布您的<b>环保需求</b></span></h3>
                    <div class="need_form container">
                        <form>
                            <div class="form-group">
                                <textarea class="form-control" rows="3" placeholder="请描述您的环保需求"></textarea>
                            </div>
                          <div class="form-group">
                            <input type="text" class="form-control" id="exampleInputName1" placeholder="请您的姓名">
                          </div>
                          <div class="form-group">
                            <input type="tel" class="form-control" id="exampleInputTel1" placeholder="请输入您的手机号">
                          </div>
                          <div class="form-group">
                            <input type="text" class="form-control" id="exampleInputCom1" placeholder="请输入您的公司名">
                          </div>
                          <p>*我们承诺为您严格保密，绝不泄漏您的信息</p>
                          <button type="submit" class="btn btn-default" id="submit_btn">确认提交</button>
                        </form>
                    </div>
                </div>
            </div>
        </div>
	</div>
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<script src="../js/mui.min.js"></script>
<script src="http://libs.baidu.com/bootstrap/3.0.3/js/bootstrap.min.js"></script>
<script>
	mui.init({
		swipeBack:false ,//启用右滑关闭功能
		keyEventBind: {
			//backbutton: false,  //Boolean(默认true)关闭back按键监听
			menubutton: false   //Boolean(默认true)关闭menu按键监听
		}
	});
	
/*var divW=$(".eia_agency_box>div:first-child").width();
var divH=$(".eia_agency_box>div:first-child").height();
console.log(divH+"-"+divW)
*/

$(".eia_agency_box").each(function(index,obj){
	$(">div",this).mouseover(function(e){	
		var offL=this.offsetLeft;
		var offT=this.offsetTop;
		//$(".eia_syle").remove();
		$('head').append('<style class="eia_syle">.eia_agency_box'+(index+1)+' > div:nth-child(1)::after{ left:'+offL+'px;top:'+offT+'px;display:block;}</style>'); 
	});
});

function checkPhone(_v) {
return (/^1[3|4|5|8][0-9]\d{8}$/.test(_v));
};
document.querySelector("#submit_btn").addEventListener("tap",function(){
	console.log("submit");
	var jsons={};
	var areaText=$("#textarea_input").val();
	var name=$("#exampleInputName1").val();
	var tel=$("#exampleInputTel1").val();
	var com=$("#exampleInputCom1").val();
	var type = 'hpbx';
	var data_source = 'special';
	if((areaText!="" && name!="" && tel!="" && com!="")){
		if(!checkPhone(tel)){
			 mui.toast("手机号不正确！");
			return false;
			};
		$.ajax({
			    type: 'GET',
				cache: false,
                url: 'http://219.135.58.197:9003/jsp/conn_User_Info.jsp?cmd=insertrequirement&queryPhone=' + tel +'&querytype='+ type + '&querydescribe='+ areaText + '&queryusername=' + name + '&querycompany=' + com + '&querydatasource=' + data_source,
                dataType: 'json',
                success: function (data) {
                        mui.toast("感谢您提交的环保需求，我们会尽快联系您！");
					 }
			});
		}else{
			 	mui.toast("内容输入有误！");
				return false;
			};
});
</script>
</body>
</ html>